<template>
	<view>
		<!-- <view class="" style="height: 120rpx;background-color: #f5f5f5;">
			
		</view> -->
		<uni-nav-bar  height="44px" :statusBar="true"    :shadow="false"  type="line" >
			<!-- <uni-icons @click="backfn" style="margin-right: 20rpx;" class="input-uni-icon" type="back" size="24" color="#282828" />
				<view class="input-view">
										<uni-icons class="input-uni-icon" type="search" size="18" color="#999" />
										<input ref="inputTop" confirm-type="search" class="nav-bar-input" type="text" placeholder="输入搜索关键词"
											@input="fninput" />
					</view> -->
			 
		</uni-nav-bar>
		 <view style="text-align: center;padding: 0 25rpx;background-color: #fff;display: flex;align-items: center;border-bottom: 2rpx solid #cecece;justify-content: space-between;">
			 	<uni-icons @click="backfn" style="margin-right: 20rpx;" class="input-uni-icon" type="back" size="24" color="#282828" />
		 	<view class="input-view">
				
		 							<uni-icons class="input-uni-icon" type="search" size="18" color="#999" />
		 							<input ref="inputTop" confirm-type="search" class="nav-bar-input" type="text" placeholder="输入搜索关键词"
		 								@input="fninput" />
		 		</view>
		 </view>
		<!-- s搜索结果 -->
		<view class="stroelist">
			<view @click="tostore(item)" class="storeitem" v-for="(item,index) in stroelist" :key="index">
				 
				<uni-icons type="paperplane" size="20" color="#cecece"></uni-icons>
				<span style="color: #a7a7a7;">{{item.store_name}}</span>
			</view>
		</view>
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				stroelist:[]
			};
		},
		onLoad() {
			
		},
		  mounted() {
		    this.$refs.inputTop.focus();
		  },
		methods:{
			backfn(){
			uni.navigateBack({delta:1})	
			},
			fninput(e){
				 console.log(e);
				 // 查询搜索
				 this.$request({
					 url:'v3/seller/front/vendor/member/list',
					 method:"GET",
					 data:{storeName:e.detail.value}
				 }).then(res=>{
					 this.stroelist=res.data.list
					 if(res.data.list.length==0){
						 uni.showToast({
						 	title:'暂未数据',
						 	icon:'none'
						 })
					 }
				 })
			},
			// 跳转
			tostore(val){
				uni.navigateTo({
					 url:"/webcont/webindex/webindex?searchId="+val.vendor_id
						  })
			}
		}
	}
</script>

<style lang="scss" scoped>
	$nav-height: 30px;
	// /deep/ .uni-navbar__content{
	// 	background-color: #f5f5f5 !important;
	// }
	// /deep/.uni-navbar__header{
	// 	background-color: #f5f5f5 !important;
	// }
	/deep/.uni-navbar__header[data-v-4afea59e] {
		height: 88rpx !important;
	}
.input-view {
			/* #ifndef APP-PLUS-NVUE */
			display: flex;
			/* #endif */
			flex-direction: row;
			width: 650rpx;
			flex: 1;
			background-color: #f8f8f8;
			height: $nav-height;
			border-radius: 15px;
			padding: 0 15px;
			flex-wrap: nowrap;
			margin: 7px 0;
			line-height: $nav-height;
		}
	
		.input-uni-icon {
			line-height: $nav-height;
		}
	
		.nav-bar-input {
			height: $nav-height;
			line-height: $nav-height;
			/* #ifdef APP-PLUS-NVUE */
			width: 560rpx;
			/* #endif */
			width: 100%;
			padding: 0 5px;
			font-size: 12px;
			background-color: #f8f8f8;
		}
		.stroelist{
			padding: 20rpx;
			background-color: #fff;
			.storeitem{
				background-color: #fff;
				padding: 10rpx 0;
			}
		}
</style>
